
<template>
  <div class="index-container">
    <div class="background">
      <img src="https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=28849038,472140465&fm=26&gp=0.jpg" width="100%" height="100%" alt="">
    </div>
    <el-row>
      <el-col>
        <el-input v-model="input" placeholder="请输入内容" class="search">
          <el-button slot="append" icon="el-icon-search">搜索</el-button>
        </el-input>
      </el-col>
    </el-row>
    <el-row :gutter="20" class="buttons">
      <el-button type="info" class="btn" v-on:click="toTypePage(2)">内容理解</el-button>
      <el-button type="info" class="btn" v-on:click="toTypePage(1)">低质审核</el-button>
      <el-button type="info" class="btn" v-on:click="toTypePage(3)">智能识别</el-button>
      <el-button type="info" class="btn" v-on:click="toTypePage(5)">优质挖掘</el-button>
    </el-row>
  </div>
</template>

<script>
export default {
  name: 'Index',
  data() {
    return {
      input: ''
    }
  },
  methods: {
    toTypePage: function(num) {
      // TODO: 修改全局pageType 然后路由跳转到默认页
      // 备注: 当前页只在登陆后出现
      this.$store.dispatch('constants/setProjectId', num)
      this.$router.push({ path: 'dashboard' })
    }
  }
}
</script>

<style scoped>
  .background {
    width: 100%;
    height: 100%;
    z-index: -1;
    position: absolute;
  }

  .front {
    /*position: absolute;*/
  }

  .search {
    width: 30%;
    float: right;
    right: 35%;
    margin-top: 80px;
  }

  .btn {
    width: 10%;
    padding: 3% 0;
    margin-left: 12%;
    margin-top: 120px;
  }
</style>
